<template>
	<div class="guide">
		<swiper class='swiper' height='100%' :list="list" dots-position='center' v-model="index" @click='toLogin'></swiper>
		<!-- <div class="tip" v-if="index==2">立即体验</div> -->

	</div>
</template>

<script>
	import {
		Swiper
	} from 'vux'

	export default {
		components: {
			Swiper
		},
		data() {
			return {
				list: [{
					url: 'javascript:',
					img: 'https://ww1.sinaimg.cn/large/663d3650gy1fq66vvsr72j20p00gogo2.jpg',
					// title: '送你一朵fua'
				}, {
					url: 'javascript:',
					img: 'https://ww1.sinaimg.cn/large/663d3650gy1fq66vw1k2wj20p00goq7n.jpg',
					// title: '送你一辆车'
				}, {
					url: '/login',
					img: 'https://ww1.sinaimg.cn/large/663d3650gy1fq66vw50iwj20ff0aaaci.jpg', // 404
					// title: '点击进入登录界面',
					// fallbackImg: 'https://ww1.sinaimg.cn/large/663d3650gy1fq66vw50iwj20ff0aaaci.jpg'
				}],
				index: 0,

			}
		},
		methods: {
			toLogin() {
				if (this.index == 2) {
					console.log(111)
				}
			}

		}
	}
</script>

<style lang="less" scoped="scoped">
	@import '~vux/src/styles/reset.less';

	body {
		background-color: #fbf9fe;
	}

	.guide {
		width: 100%;
		height: 100%;

		.swiper {
			width: 100%;
			height: 100%;
		}

		.tip {
		    width: 120px;
				height: 30px;
				border: 1px solid white;
				border-radius: 10px;
				color: white;
				position: absolute;
				bottom: 5%;
				left: 50%;
				-webkit-transform: translateX(-50%);
				transform: translateX(-50%);
				text-align: center;
				line-height: 30px;
		}
	}
</style>
